<template>
  <div>
    <el-main>
      回收站{{ sum }}
      <ul>
        <li
          v-for="item in $store.state.shoplist"
          :key="item.id"
          v-show="item.status == 2"
        >
          <span class="sp">{{ item.title }}</span>
          <el-button type="warning" @click="huai(item.id)" class="btn"
            >还原</el-button
          >
        </li>
        <el-button type="primary" @click="ha">全部</el-button>
      </ul>
    </el-main>
  </div>
</template>
<script>
export default {
    data() {
        return {
            
        }
    },
    mounted() {
        
    },
    methods: {
        huai(id){
            this.$store.commit("huai",id);
        },
        ha(){
            this.$store.commit("ha");
        },
    },
    computed:{
        sum(){
            let res =this.$store.state.shoplist.filter((item)=>{
                return item.status==2;
            });
            return res.length;
        },
    },
};
</script>
<style lang="scss" scoped>
  .btn{
    position: relative;
    right: -500px;
  }
  ul{
    position: relative;
    li{
      line-height: 39.6px;
      height: 39.6px;
      margin: 15px 0px;
      .sp{
        position: absolute;
        left: 100px;
      }
    }
  }
</style>